<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
    <title>${table.title}</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta content="${table.keywords}" name="keywords">
    <meta content="${table.description}" name="description">
    <link rel="stylesheet" type="text/css" href="css/reset.css">
    <link rel="stylesheet" type="text/css" href="css/base.css">
    <link rel="stylesheet" type="text/css" href="css/index.css">
</head>

<body>
<div class="net-main-nav index-nav-sp">
    <div class="net-main-nav-inner">
        <div class="net-main-logo">
            <a href="#"><img src="images/logo.png"></a>
        </div>
        <ul class="net-main-nav-content">
            <li><a href="#" class="current">首页</a></li>
            <li><a href="#">视频</a></li>
            <li><a href="#">发行</a></li>
            <li><a href="#">文章</a></li>
            <li><a href="#">艺人</a></li>
            <li><a href="#">活动</a></li>
        </ul>

        <div class="net-main-nav-login">
            <a href="#">登录</a>
            <a href="#">注册</a>
        </div>
        <div class="net-main-nav-search">
            <input type="text" class="net-main-nav-input" placeholder="影片，文章，艺人，活动">
            <button type="button" class="net-main-nav-button">搜索</button>
        </div>
    </div>
</div>
<div class="index-banner">
    <div id="jssor_1" style="visibility: visible; width: 1920px; height: 500px;" >
        <!-- Loading Screen -->
        <div data-u="loading" style="position: absolute; top: 0px; left: 0px;">
            <div style="filter: alpha(opacity=70); opacity: 0.7; position: absolute; display: block; top: 0px; left: 0px; width: 100%; height: 100%;"></div>
            <div style="position: absolute; display: block; background: url(images/loading.gif) no-repeat center center; top: 0px; left: 0px; width: 100%; height: 100%;"></div>
        </div>
        <div data-u="slides" style="position: absolute; left: 0px; top: 0px; width: 1920px; height: 500px; overflow: hidden;">
            <#list table.banners as banner>
                <div>
                    <a href="${banner.href}" target="_blank">
                        <img src="${banner.src}" />
                    </a>
                </div>
            </#list>
        </div>
        <!-- Bullet Navigator -->
        <div data-u="navigator" class="jssorb21" style="bottom:16px;right:16px;" data-autocenter="1">
            <!-- bullet navigator item prototype -->
            <div data-u="prototype" class=""><div style="font-size:13px;" u="numbertemplate"></div></div>
        </div>
        <!-- Arrow Navigator -->
        <div class="arrow-wapper">
            <span data-u="arrowleft" class="jssora22l" style="top:220px;left:12px;width:40px;height:58px;" data-autocenter="2"></span>
            <span data-u="arrowright" class="jssora22r" style="top:220px;right:12px;width:40px;height:58px;" data-autocenter="2"></span>
        </div>
    </div>
</div>
<div class="net-wapper ">
    <div class="net-wapper-title clearfix">
        <a class="title-name" href="/media" target="_blank"><h1>视频 MEDIA</h1></a>
        <a class="title-more" href="#">全部 +</a>
    </div>
    <div class="net-media-part clearfix">
        <#assign i = 0 />
        <#list table.medias as media>
            <#if i==0>
                <a href="${media.href}" class="net-media-big">
                    <img src="${media.src}" alt="${media.title}">
                    <h2 class="net-media-big-title">${media.title}</h2>
                </a>
            <#else>
                <a href="${media.href}" class="net-media-small">
                    <img src="${media.src}" alt="${media.title}">
                    <h2 class="net-media-small-title">${media.title}</h2>
                </a>
            </#if>
            <#assign n = n+1 />
        </#list>
    </div>
    <div class="net-wapper-title clearfix">
        <a class="title-name" href="/media" target="_blank"><h1>发行 PUBLISH</h1></a>
        <a class="title-more" href="#">全部 +</a>
    </div>
    <div class="net-publish-part clearfix">
        <#list table.publishs as publish>
            <a href="${publish.href}" class="net-publish-small">
                <div class="net-publish-small-cover">
                    <img src="${publish.src}" alt="${publish.title}">
                    <div class="net-publish-small-info">
                        <span class="net-publish-view-num">${publish.num}</span>
                        <span class="net-publish-view-form">全网点击</span>
                        <span class="net-publish-view-place">渠道<i>${publish.channel}</i>家</span>
                        <span class="net-publish-view-news">动态<i>${publish.dynamic}</i>条</span>
                    </div>
                </div>
                <div class="net-publish-small-title">${publish.title}</div>
            </a>
        </#list>
    </div>
    <div class="net-wapper-title clearfix">
        <a class="title-name" href="/media" target="_blank"><h1>文章 ARTICLE</h1></a>
        <a class="title-more" href="#">全部 +</a>
    </div>
    <div class="net-article-part clearfix">
        <#list table.articles as article>
            <div class="net-article-item">
                <div class="net-article-cover">
                    <a href="${article.href}"><img src="${article.src}"></a>
                </div>
                <div class="net-article-title">
                    <a href="${article.href}">${article.title}</a>
                </div>
                <div class="net-article-user">
                            <span class="net-article-user-name">
                                ${article.userName}
                            </span>
                    <div class="net-article-view-info">
                        <span class="net-article-visit-num"><i>${article.readNum}</i>人阅读</span>
                        <span class="net-article-comment-num"><i>${article.comment}</i>人评论</span>
                    </div>
                </div>
            </div>
        </#list>
    </div>
    <div class="net-wapper-title clearfix">
        <a class="title-name" href="/media" target="_blank"><h1>艺人 ACTOR</h1></a>
        <a class="title-more" href="#">全部 +</a>
    </div>
    <div class="net-actor-part clearfix">
        <#list table.actors as actor>
            <a href="#{actor.href}" class="net-actor-item">
                <img src="${actor.src}">
                <div class="net-actor-title"><p class="net-actor-name">${actor.name}</p><p>演员</p></div>
            </a>
        </#list>
    </div>
    <div class="net-wapper-title clearfix">
        <a class="title-name" href="/media" target="_blank"><h1>活动 ACTIVITIES </h1></a>
        <a class="title-more" href="#">全部 +</a>
    </div>
    <div class="net-activities-part clearfix">
        <#list table.activitys as activity>
            <a href="${activity.href}" class="net-activities-item">
                <img src="${activity.src}">
                <div class="net-activities-title">${activity.title}</div>
            </a>
        </#list>
    </div>
</div>

<div class="global-footer-new">
    <div class="footer-inner clear">
        <div class="inner-nav clear">
            <a class="inner-logo " href="/"></a>
            <a>年轻人的生活方式</a></div>
        <div class="inner-copyr">
            <div class="footer-nav">
                <a href="/">首页</a>
                <a href="/home">视频</a>
                <a href="/test">发行</a>
                <a href="/video">文章</a>
                <a href="/video">艺人</a>
                <a href="/video">活动</a>
            </div>
            <div class="footer-logo">
                <span class="inner-tech">TECHNOLOGY STAYS TRUE HERE &nbsp;</span><em>|</em>
                <span class="inner-copy-new">&nbsp;<span class="text-color-light">© 2016</span>&nbsp;<span class="text-color-black">N<sup>+</sup>CINES</span>&nbsp;</span><em>|</em>
                <span class="inner-no"><a href="http://www.miitbeian.gov.cn" target="_blank" rel="nofollow">粤ICP备12076188号-1</a>&nbsp;</span>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/jssor.slider.min.js"></script>
<script>
    jssor_1_slider_init = function() {

        var jssor_1_options = {
            $AutoPlay: true,
            $SlideDuration: 800,
            $SlideEasing: $Jease$.$OutQuint,
            $CaptionSliderOptions: {
                $Class: $JssorCaptionSlideo$
            },
            $ArrowNavigatorOptions: {
                $Class: $JssorArrowNavigator$
            },
            $BulletNavigatorOptions: {
                $Class: $JssorBulletNavigator$
            }
        };

        var jssor_1_slider = new $JssorSlider$("jssor_1", jssor_1_options);
        function ScaleSlider() {
            var refSize = jssor_1_slider.$Elmt.parentNode.clientWidth;
            if (refSize) {
                refSize = Math.min(refSize, 1920);
                $('.arrow-wapper').css({'width':refSize,"margin-left":-Math.ceil(refSize/2)})
                // jssor_1_slider.$ScaleWidth(refSize);
            }
            else {
                window.setTimeout(ScaleSlider, 30);
            }
        }
        ScaleSlider();
        $Jssor$.$AddEvent(window, "load", ScaleSlider);
        $Jssor$.$AddEvent(window, "resize", ScaleSlider);
        $Jssor$.$AddEvent(window, "orientationchange", ScaleSlider);

    };
</script>

<script>
    $(function(){
        jssor_1_slider_init();
    })
</script>
</body>

</html>